.search-bar{
	height: 108rpx;
	width: 100%;
	display: flex;
	align-items: center;
	padding: 0rpx 32rpx 0rpx 32rpx;
	box-sizing: border-box;
	// justify-content: center;
	.search-input-container{
		height: 76rpx;
		width: 100%;
		position: relative;
		display: flex;
		align-items: center;
		.search-input{
			// width: 100%;
			flex: 1;
			height: 100%;
			background-color: #f6f6f6;
			border-radius: 38px;
			padding-left: calc(50% - 44rpx);
			box-sizing: border-box;
			color: #AFAFAF;
			font-weight: 400;
			transition-duration: .3s;
			&.current-search{
				padding-left: 84rpx !important;
			}
		}
		.search-icon{
			height: 28rpx;
			position: absolute;
			top: 50%;
			transform: translateY(-57%);
			left: calc(50% - 76rpx);
			transition-duration: .3s;
			&.current-search{
				left: 32rpx;
			}
		}
	}
	.cancel-button{
		// flex: 1;
		width: 108rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #0078FB;
		font-weight: 800;
		text-align: center;
	}
}